<template>
	<nut-swiper :init-page="page" :pagination-visible="true" pagination-color="#426543" auto-play="3000">
		<nut-swiper-item v-for="item in swiperData" :key="item">
			<img :src="item.image" alt="" />
		</nut-swiper-item>
	</nut-swiper>
</template>

<script setup>
	import {
		ref,
		onMounted
	} from 'vue'
	import {
		getHomeSwiper,
	} from '@/api/common.js'

	var swiperData = ref([
		'https://storage.360buyimg.com/jdc-article/NutUItaro34.jpg',
		'https://storage.360buyimg.com/jdc-article/NutUItaro2.jpg',
		'https://storage.360buyimg.com/jdc-article/welcomenutui.jpg',
		'https://storage.360buyimg.com/jdc-article/fristfabu.jpg'
	])

	onMounted(() => {
		console.log("执行");
		getHomeSwiper()
			.then(res => {
				console.log('getHomeSwiper', res)
				if (res.code != 0) {
					console.log(`获取数据失败，` + res.message);
				} else {
					swiperData.value = res.data
					console.log("获取数据成功")
				}
			})
			.catch(err => {
				console.log(err, `服务端错误！`)
			})
	})
</script>

<style>
	.nut-swiper-item img {
		width: 100%;
		height: 200px;
	}
</style>
